<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        function ajaxGetPromise(obj) {
            return new Promise((resolve, reject) => {
                let { url, params } = obj;

                let queryStr = '';
                if (params) {
                    queryStr = Object.entries(params).map(([key, value]) => {
                        return key + '=' + value;
                    }).join('&');
                }
                let fullUrl = params ? url + '?' + queryStr : url;
                const xhr = new XMLHttpRequest();
                xhr.open('GET', fullUrl);
                xhr.setRequestHeader('accept', 'application/json');
                xhr.send();

                xhr.addEventListener('readystatechange', function () {
                    if (this.readyState === 4) {
                        if (this.status >= 200 && this.status < 300) {
                            let res = JSON.parse(xhr.responseText);
                            resolve(res);
                        } else {
                            reject(new Error(`Request failed with status ${this.status}`));
                        }
                    }
                });

                xhr.onerror = function () {
                    reject(new Error('Network error'));
                };
            });

        }
        ajaxGetPromise({ url: "http://106.52.75.114/api/v2/home/banners" })
            .then(r => {
                console.log(r);
            })
            .catch(err => {
                console.log(err);
                throw err;
            })
    </script>
</body>

</html>